<template>
	<view class="warp" style="background: white; height: 100%;">
		<view class="uni-margin-wrap">
			<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
				:duration="duration">
				<swiper-item v-for="(item, index) in adObjData.list" :key="index">
					<view class="swiper-item">
						<image class="image" :src="getImgUrl(item.image,'banner')" mode="aspectFill"></image>
					</view>
				</swiper-item>
			</swiper>
			<!-- <diy-notice :value="noticeObjData"></diy-notice> -->
		</view>
 
		<view class="wl-search">
			<view class="wl-search-view">
				<view class="wl-search-nav-ivew">
					<view class="wl-search-nav-item" @click="searchNavClick(4)">
						<text class="text">运单查询</text>
						<view
							:class="searchNavStatus === 4 ? 'wl-search-nav-line-select' : 'wl-search-nav-line-unselect'">
						</view>
					</view>
					<view class="wl-search-nav-item" >
						 			 
					</view>
					
					<view class="wl-search-nav-item" >
						 
					</view>
					
					<!-- <view class="wl-search-nav-item" @click="searchNavClick(2)">
						<text class="text">地区查询</text>
						<view  :class="searchNavStatus === 2 ? 'wl-search-nav-line-select' : 'wl-search-nav-line-unselect'" ></view>
					</view>

					<view class="wl-search-nav-item" @click="searchNavClick(1)">
						<text class="text">公司查询</text>
						<view
							:class="searchNavStatus === 1 ? 'wl-search-nav-line-select' : 'wl-search-nav-line-unselect'">
						</view>
					</view> -->
					
				</view>

				<view v-if="searchNavStatus == 1" class="wl-search-company">
					<view class="wl-search-company-body">
						<view class="wl-search-company-body-view">
							<input class="uni-input" type="text" placeholder="请输入公司关键字"
								v-model="searchInputData.companyKey" />
							<view class="wl-search-company-body-view-line"></view>
						</view>
						<view class="wl-search-right-view">
							<view class="wl-search-right-btn" @click="searchBtnClick(searchNavStatus)"><text>查询</text>
							</view>
						</view>
					</view>
				</view>
				<view v-if="searchNavStatus == 2" class="wl-search-line">
					<view class="wl-search-line-body">
						<view class="wl-search-line-body-input">
							<view class="wl-search-line-body-view">
								<!-- <image class="image" src="../../../static/home/home_dizhi.png"></image> -->
								<input class="input search-text" disabled type="text" placeholder="如:临沂"
									v-model="searchInputData.fromArea" />
							</view>
							<view class="wl-search-line-body-image-view">
								<image class="image" :src="'/static/home/home_wangfandijia.png'"></image>
							</view>

							<view class="wl-search-line-body-view">
								<!-- <image class="image" src="../../../static/home/home_wangfandijia.png"></image> -->
								<input class="uni-input search-text" type="text" placeholder="如:临沂"
									v-model="searchInputData.toArea" />
							</view>
						</view>

						<view class="wl-search-line-bottom-view">
							<view class="wl-search-line-bottom-btn" @click="searchBtnClick(searchNavStatus)">
								<text>查询</text></view>
						</view>
					</view>
				</view>
				<view v-if="searchNavStatus == 3" class="wl-search-order">
					<view class="wl-search-company-body">
						<view class="wl-search-company-body-view">
							<input class="uni-input" type="text" placeholder="请输入园区关键字"
								v-model="searchInputData.orderKey" />
							<view class="wl-search-company-body-view-line"></view>
						</view>
						<view class="wl-search-right-view">
							<view class="wl-search-right-btn" @click="searchBtnClick(searchNavStatus)"><text>查询</text>
							</view>
						</view>
					</view>
				</view>
				<view v-if="searchNavStatus == 4" class="wl-search-order">
					<view class="wl-search-company-body">
						<view class="wl-search-company-body-view">
							<input class="uni-input" type="text" placeholder="请输入运单关键字"
								v-model="searchInputData.orderKey" />
							<view class="wl-search-company-body-view-line"></view>
						</view>
						<view class="wl-search-right-view">
							<view class="wl-search-right-btn" @click="searchBtnClick(searchNavStatus)"><text>查询</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>



		<view class="wl-recommend" v-if="getScanShow()">
			<view class="wl-recommend-view">
				<view class="wl-recommend-nav-ivew">
					<uni-row>
						<uni-col :span="8">
							<view class="wl-recommend-item wl-recommend-item-left" @click="recommendClick(1)">
								<view class="wl-recommend-item-back ">
									<!-- <image class="wl-recommend-item-back-img" :src="'/static/home/home_saoma.png'"></image> -->
									<view class="wl-recommend-item-back-view wl-recommend-item-back-color2">
										<image class="item-image" mode="aspectFit" :src="'/static/home/home_saoma.png'"></image>
										<view class="item">
											<text class="text">到货确认</text>
											<text class="text1">需扫码</text>
										</view>
									</view>
								</view>
							</view>
						</uni-col>
						<uni-col :span="8">
							<view class="wl-recommend-item wl-recommend-item-center" @click="recommendClick(2)">
								<view class="wl-recommend-item-back ">
									<!-- <image class="wl-recommend-item-back-img" :src="'/static/home/home_saoma.png'"></image> -->
									<view class="wl-recommend-item-back-view wl-recommend-item-back-color1">
										<image class="item-image" mode="aspectFit" :src="'/static/home/home_saoma.png'"></image>
										<view class="item">
											<text class="text">{{showDepartTitle()}}</text>
											<text class="text1">需扫码</text>
										</view>
									</view>
								</view>
							</view>
						</uni-col>
						<uni-col :span="8">
							<view class="wl-recommend-item wl-recommend-item-right" @click="recommendClick(3)">
								<view class="wl-recommend-item-back ">
									<image class="item-image" mode="aspectFit" :src="'/static/icons/grid.png'"></image>
									<view class="wl-recommend-item-back-view wl-recommend-item-back-color3">
										<view class="item">
											<text class="text">开单</text>
											<text class="text1">运单录入</text>
										</view>
									</view>
								</view>
							</view>
						</uni-col>
					</uni-row>
				</view>
			</view>
		</view> 
		<view class="wl-recommend" v-if="getScanShow()">
			<view class="wl-recommend-view">
				<view class="wl-recommend-nav-ivew">
					<uni-row>
						<uni-col :span="8">
							<view class="wl-recommend-item wl-recommend-item-left" @click="recommendClick(4)">
								<view class="wl-recommend-item-back ">
									<!-- <image class="wl-recommend-item-back-img" :src="'/static/home/home_saoma.png'">
									</image> -->
									<view class="wl-recommend-item-back-view wl-recommend-item-back-color2">
										<image class="item-image" mode="aspectFit" :src="'/static/order/order_top_title.png'"></image>
										<view class="item">
											<text class="text">车次列表</text>
											<text class="text1">待上传凭证车次</text>
										</view>
									</view>
								</view>
							</view> 
						</uni-col>
						<uni-col :span="8">
							<view class="wl-recommend-item wl-recommend-item-center" @click="recommendClick(5)">
								<view class="wl-recommend-item-back ">
									
									<view class="wl-recommend-item-back-view wl-recommend-item-back-color1">
										<image class="item-image" mode="aspectFit" :src="'/static/icons/group.png'"></image>
										<view class="item">
											<text class="text">{{showDepartListTitle()}}</text>
											<text class="text1">待上传凭证运单</text>
										</view>
									</view>
									<!-- <image class="wl-recommend-item-back-img" :src="'/static/home/home_saoma.png'">
									</image> -->
								</view>
							</view> 
						</uni-col>
						<uni-col :span="8">
							 
						</uni-col>
					</uni-row>
					 
				</view>
			</view>
		</view>
		<!-- <view class="wl-list">
			<view class="wl-list-view">
				<view class="wl-list-header">
					<view class="wl-list-header-view">
						<text>专线推荐</text>
						<view class="wl-header-line"></view>
					</view>
				</view>
			</view>
		</view>
		<view class="wl-list">
			<view class="wl-list-view">
				<view class="wl-list-body">
					<block v-for="(item, index) in logisticsList" :key="index">
						<fsw-item :value="item"></fsw-item>
					</block>
				</view>
			</view>
		</view> -->

	</view>
</template>

<script>
	import diyImgAds from '@/components/diy-img-ads/diy-img-ads.vue';
	// import diyNotice from '@/components/diy-notice/diy-notice.vue';
	import home from './home.js';

	export default {
		components: {
			diyImgAds,
			// diyNotice
		},
		mixins: [home],
		data() {
			return {};
		},
		onPullDownRefresh() {
			uni.stopPullDownRefresh();
		},
		onReachBottom() {
			this.status = 'more';
		},
		 
	};
</script>
<style lang="scss">
	@import './home.scss';

	/* #ifdef H5 */
	@media screen and (min-width: 768px) and (max-width: 1425px) {
		.swiper {
			height: 630px;
		}
	}

	@media screen and (min-width: 1425px) {
		.swiper {
			height: 830px;
		}
	}

	/* #endif */

	.user-section {
		/*  #ifdef MP || APP-PLUS */
		// height: 530rpx;
		padding: 70rpx 0 0;
		/* #endif */
		/*  #ifdef H5 || MP-ALIPAY*/
		// height: 430rpx;
		padding: 70rpx 0 0;
		/* #endif */
		box-sizing: border-box;
		position: relative;

		.bg-img {
			overflow: hidden;
			position: absolute;
			width: 100%;
			// height: 332rpx;
			top: 0;

			image {
				width: 100%;
				height: 532rpx;
			}
		}

		.user-section-box {
			width: 100%;
			padding: 0 50rpx;
			box-sizing: border-box;
			position: relative;
			z-index: 100;
		}

		.user-info-box {
			display: flex;
			align-items: center;

			&.no-log {
				position: relative;
				z-index: 333;

				.user-title {
					font-size: 40rpx;
					color: #fff;
					line-height: 1.2;
					margin-bottom: 16rpx;
				}

				.user-desc {
					border: none !important;
					font-size: 33rpx;
					color: #fff !important;
					padding: 0 !important;
				}
			}

			.user-head {
				box-sizing: content-box;
				width: 90rpx;
				height: 90rpx;
				border: 3px solid #fff;
				border-radius: 50%;
				overflow: hidden;
				display: flex;
				align-items: center;
				justify-content: center;

				image {
					width: 106rpx;
					height: 106rpx;
				}
			}

			.user-box {
				flex: 1;
				display: flex;
				flex-direction: column;
				margin-left: 17rpx;
				height: 100%;

				text {
					width: 300rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
					font-size: 22rpx;
					color: #fff;
					line-height: 1;
				}

				.user-label {
					margin-top: 18rpx;

					text {
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						color: #e7e525;
						padding: 4rpx 16rpx;
						font-size: 13rpx;
						line-height: 1;
						background: rgba(0, 0, 0, 0.5);
						border-radius: 40rpx;
					}
				}
			}
		}

		.user-set {
			position: absolute;
			// width: 40rpx;
			// height: 40rpx;
			display: flex;
			align-items: center;
			right: 30rpx;
			/* #ifdef  MP*/
			top: 20rpx;
			/* #endif */
			/* #ifdef  H5 || MP-ALIPAY*/
			top: 10rpx;
			/* #endif */

			.iconfont {
				font-size: 40rpx;
				color: #fff;
				line-height: 1;
				margin-left: 18rpx;
			}
		}
	}
</style>